<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
    <link rel="stylesheet" type="text/css" href="__PUBLIC__/css/bootstrap.min.css">
    <style type="text/css">
        .container{
            margin-top: 4em;
        }

        .refresh{
            animation:mymove 1.5s linear infinite;
            -webkit-animation:mymove 1.5s linear infinite;
        }

        @keyframes mymove{
             0%{ 
                    transform:rotate(0deg);
                    -ms-transform:rotate(0deg);     /* IE 9 */
                    -moz-transform:rotate(0deg);    /* Firefox */
                    -webkit-transform:rotate(0deg); /* Safari 和 Chrome */
                    -o-transform:rotate(0deg);  
                }

                100%{
                    transform:rotate(360deg) ;
                     -ms-transform:rotate(360deg);     /* IE 9 */
                    -moz-transform:rotate(360deg);    /* Firefox */
                    -webkit-transform:rotate(360deg); /* Safari 和 Chrome */
                    -o-transform:rotate(360deg);  
                }
        }

        @-webkit-keyframes mymove{
                0%{ 
                    transform:rotate(0deg);
                    -ms-transform:rotate(0deg);     /* IE 9 */
                    -moz-transform:rotate(0deg);    /* Firefox */
                    -webkit-transform:rotate(0deg); /* Safari 和 Chrome */
                    -o-transform:rotate(0deg);  
                }

                100%{
                    transform:rotate(360deg) ;
                     -ms-transform:rotate(360deg);     /* IE 9 */
                    -moz-transform:rotate(360deg);    /* Firefox */
                    -webkit-transform:rotate(360deg); /* Safari 和 Chrome */
                    -o-transform:rotate(360deg);  
                }
        }
    </style>
    <script type="text/javascript" src="__PUBLIC__/js/jquery-2.2.3.js"></script>
    <script type="text/javascript" src="__PUBLIC__/js/bootstrap.min.js"></script>
    <script type="text/javascript">
        $().ready(function(){
            $("#school").change(function(){

                // alert($(this).val());

               if($(this).val()!=="0"){
                    $("#refresh").addClass("refresh");
                    // $('#myModal').modal("show");
                    $('#myModal').modal(
                    {
                        backdrop:"static",
                        keyboard: true
                    }
                    );

                    setTimeout(function(){
                       $('#myModal').modal("toggle");
                    },5000);
                    
                }

            })
        })
    </script>
</head>
<body>
<div class="container">
    <div class="top navbar-fixed-top text-center">
        <div class="logo">英文logo 用户注册</div>
    </div>
    <form class="form-horizontal" method="post" action="<?php echo U('Home/Register/index') ?>?id=<?php echo $user['id']; ?>">
        <div class="form-group">
            <label for="" class="col-sm-2 col-xs-2 control-label">用户名</label>
            <div class="col-sm-10 col-xs-10">
                <input type="text" class="form-control" name="user" id="" placeholder="用户名/请使用字母数字组合">
            </div>
        </div>
        <div class="form-group">
            <label for="" class="col-sm-2 col-xs-2 control-label">昵称</label>
            <div class="col-sm-10 col-xs-10">
                <input type="text" class="form-control" name="ssid" id="" placeholder="昵称">
            </div>
        </div>
        <div class="form-group">
            <label for="" class="col-sm-2 col-xs-2 control-label">密码</label>
            <div class="col-sm-10 col-xs-10">
                <input type="password" class="form-control" name="pass" id="" placeholder="密码">
            </div>
        </div>
        <div class="form-group">
            <label for="" class="col-sm-2 col-xs-2 control-label">确认密码</label>
            <div class="col-sm-10 col-xs-10">
                <input type="password" class="form-control" name="repass" id="" placeholder="确认密码">
            </div>
        </div>
        <div class="form-group">
            <label for="" class="col-sm-2 col-xs-2 control-label">邮箱</label>
            <div class="col-sm-10 col-xs-10">
                <input type="email" class="form-control" name="email" id="" placeholder="邮箱">
            </div>
        </div>
        <div class="form-group">
            <label for="" class="col-sm-2 col-xs-2 control-label">手机</label>
            <div class="col-sm-10 col-xs-10">
                <input type="text" class="form-control" name="phone" id="" placeholder="手机">
            </div>
        </div>

        <div class="form-group">
            <label for="" class="col-sm-2 col-xs-2 control-label">学校</label>
            <div class="col-sm-10 col-xs-10">
               <select id="school">
                     <option value="0">--选择地区--</option>
                     <foreach name="area" item="v">
                         <option value="{$v.id}">{$v.name}</option>
                     </foreach>
               </select>
            </div>
        </div>


        <!-- 模态框（Modal） -->
        <div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" style="top:30%">
            <div class="modal-dialog">
                <div class="modal-content">           
                    <div class="modal-body text-center"><p class="text-muted">加载中...</p><span id="refresh" class="glyphicon glyphicon-refresh"></span></div>
                    
                </div><!-- /.modal-content -->
            </div><!-- /.modal-dialog -->
        </div>
        <!-- /.modal -->
        


        <div class="form-group">
            <div class="col-sm-offset-2 col-sm-10">
                <button type="submit" class="btn btn-default">注册</button>
            </div>
        </div>
    </form>
</div>
<script type="text/javascript">var cnzz_protocol = (("https:" == document.location.protocol) ? " https://" : " http://");document.write(unescape("%3Cspan id='cnzz_stat_icon_1261708147'%3E%3C/span%3E%3Cscript src='" + cnzz_protocol + "s11.cnzz.com/z_stat.php%3Fid%3D1261708147%26show%3Dpic' type='text/javascript'%3E%3C/script%3E"));</script>
</body>
</html>